import React from "react"
import {BrowserRouter as Router,Route,Link} from "react-router-dom"
import IndexRoute from "./indexRoute"
import DetailRoute from "./detailRoute"
import ProRoute from "./ProRoute"
import ProIndex from "./ProIndex"
import DetailIndex from "./DetailIndex"
const ReactRoute = ()=>{
    return (
        //BrowserRouter内部要有一个根元素
        <Router>
            <div>
                <Link to='/'>首页</Link>
                <Link to='/detail'>详情页</Link>
                <Link to='/pro'>商品页</Link>
                <Route path='/' exact component={IndexRoute}></Route>
                <Route path="/detail" exact component={DetailRoute}></Route>
                <Route path="/pro" exact component={ProRoute}></Route>
                <Route path="/proindex/:id" exact component={ProIndex}></Route>
                <Route path="/detailindex" exact component={DetailIndex}></Route>
                {/* <Route path="/" exact render={()=><div>这是根页面</div>}></Route>
                <Route path="/detail" exact render={()=><div>这是详情页</div>}></Route> */}
            </div>
        </Router>
    )
}
export default ReactRoute